import img from "@/assets/Images/serve.jpg";
import { Tabs, TabsProps } from "antd";
import "./index.less";
const items: TabsProps["items"] = [
  {
    key: "1",
    label: "退货",
    children: (
      <div className="server-content-wrap">
        <div className="server-content">
          <div>自收货日期7日内无拆封使用的话可以无理由为您退货。</div>
          <div>您可联系电话或者微信找到我们</div>
        </div>
      </div>
    ),
  },
  {
    key: "2",
    label: "换货",
    children: (
      <div className="server-content-wrap">
        <div>
          自收货日期14日内因为质量问题，或者使用型号问题。您可以按如下操作：
        </div>
        <div className="server-title">（1）提交申请</div>
        <div className="server-content">
          请拨打客服电话或者添加客服微信，填写您的产品信息和个人信息，提交给客服。
        </div>
        <div className="server-title">（2）寄出产品</div>
        <div className="server-content">
          维修申请提交成功后，我们将通知您寄回，您可将产品寄送到指定售后维修服务中心。产品寄出之后，请联系相关客服人员并将单号一并发送给客服。
        </div>
        <div className="server-title">（3）寄回产品</div>
        <div className="server-content">
          换货完成后，售后维修服务中心将货品邮寄给您，当您收到货品后，请与相关客服人员联系并确认收货，即换货完成。
        </div>
      </div>
    ),
  },
  {
    key: "3",
    label: "维修",
    children: (
      <div className="server-content-wrap">
        <div>
          非人为损坏，1个月质保期内免费维修，终身质量保障。
          您可以通过以下途径进行货品的维修：
        </div>
        <div className="server-title">（1）提交申请</div>
        <div className="server-content">
          请拨打客服电话或者添加客服微信，填写您的产品信息和个人信息，提交给客服。
        </div>
        <div className="server-title">（2）寄出产品</div>
        <div className="server-content">
          维修申请提交成功后，我们将通知您寄回，您可将产品寄送到指定售后维修服务中心。产品寄出之后，请联系相关客服人员并将单号一并发送给客服。
        </div>
        <div className="server-title">（3）售后维修</div>
        <div className="server-content">
          售后维修服务中心收到您的产品后会进行全面检测，如判定产品不在免费保修范围内，请根据提供的报价单确认报价，并支付维修款项，支付完成后会安排维修。如判定产品在保修期内出现性能故障，会免费安排维修。您可通过客服人员查询维修进度和费用信息。
        </div>
        <div className="server-title">（4）寄回产品</div>
        <div className="server-content">
          维修完成后，售后维修服务中心将返修品邮寄给您，当您收到返修品后，请与相关客服人员联系并确认收货，即维修完成。
        </div>
        <div className="server-title">维修费用</div>
        <div className="server-content">
          保内维修服务：经检测后确认属于保内维修，往返运费由我司承担；
        </div>
        <div className="server-content">保外维修服务：往返运费由您承担。</div>
      </div>
    ),
  },
];
const SupplyServe = () => {
  return (
    <div className="serve-wrap">
      <div className="serve-img">
        <img src={img} alt="服务" />
      </div>
      <div className="serve-content">
        <Tabs items={items}></Tabs>
      </div>
    </div>
  );
};
export default SupplyServe;
